import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import '../common/global/global.dart';

// +----------------------------------------------------------------------
// | ios版的底部弹出滚动窗
// +----------------------------------------------------------------------

// 用法
// IosBottomSheet(["111", "222", "333"], (item,index) {
//   print(item);
//   print(index);
// })

class IosBottomSheet extends StatefulWidget {
  IosBottomSheet(this.list, this.confirm, {Key key}) : super(key: key);

  /// 滚动列表数据数组
  final List<String> list;

  /// 确认按钮回调函数
  final Function confirm;

  @override
  _IosBottomSheetState createState() => _IosBottomSheetState();
}

class _IosBottomSheetState extends State<IosBottomSheet> {
  /// 当前选择中的元素
  String selectItem;
  /// 当前选择中的索引
  int selectIndex = 0;

  @override
  void initState() {
    super.initState();
    if (mounted && widget.list.isNotEmpty) {
      setState(() {
        selectItem = widget.list[0];
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      height: px(500),
      child: Column(
        children: <Widget>[
          Container(
            height: px(90),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                FlatButton(
                  onPressed: () => Navigator.pop(context),
                  child: Text(
                    "取消",
                    style: TextStyle(
                      color: col("909399"),
                      fontSize: px(34),
                    ),
                  ),
                ),
                FlatButton(
                  onPressed: () {
                    widget.confirm(selectItem, selectIndex);
                    Navigator.pop(context);
                  },
                  child: Text(
                    "确定",
                    style: TextStyle(
                      color: col("5640c6"),
                      fontSize: px(34),
                    ),
                  ),
                ),
              ],
            ),
          ),
          Divider(
            height: px(1),
            indent: px(30),
            endIndent: px(30),
            color: col("edeff2"),
          ),
          Expanded(
            child: Container(
              padding: EdgeInsets.symmetric(horizontal: px(30)),
              child: CupertinoPicker(
                backgroundColor: Colors.white,
                itemExtent: px(70),
                onSelectedItemChanged: (position) {
                  setState(() {
                    selectIndex = position;
                    selectItem = widget.list[position];
                  });
                },
                children: widget.list.map((item) {
                  return Container(
                    child: Text(item),
                    height: px(70),
                    alignment: Alignment.center,
                  );
                }).toList(),
              ),
            ),
          ),
        ],
      ),
    );
  }
}